import React from 'react'

 class Lifeclass extends React.Component {
     state = {
         name:"zhangsan"
     }
   // 生命周期是组件内在特定时间段内自动执行的函数，这些函数不需要手动调用
//    constructor(props) {
//         console.log("constructor");
//         super(props)
//    }
//   componentWillMount() {
//       console.log("componentWillMount");
// console.log( document.getElementById("spans") )
//   }
  fn () {
      this.setState({
          name:"lisi"
      })
  }
//   shouldComponentUpdate() { // 组件应该更新吗？
//       return true
//   }
  render() { 
    // let {name} = this.state 
    console.log("render")
    return (
      <div>
          <span id='spans'>{this.state.name}</span>
           <button onClick={this.fn.bind(this)}>修改</button>
      </div>
    )
  }
  componentDidMount(){ //发起ajax请求，获取dom
    console.log("componentDidmounted");
    console.log( document.getElementById("spans") );
  }
  componentWillUnmount() { // 组件将要卸载的时候执行
      // 清空定时器延时器，释放内存，卸载插件
      console.log("组件销毁（卸载的）生命周期");
  }
}

export default Lifeclass